<template>
  <div id="app">
    <router-view v-if="isRouterAlive"/>
  </div>
</template>

<script>
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
import Vue from 'vue'

export default {
  name: 'App',
  provide () {
    return {
      reload: this.reload
    }
  },
  data () {
    return {
      isRouterAlive: true,
      startTime: 0
    }
  },
  mounted: function () {
    window.addEventListener('beforeunload', e => this.onbeforeunloadLocal())
    window.addEventListener('unload', e => this.unloadLocal())
  },
  created: function () {
    let xAuthToken = sessionStorage.getItem('x-auth-token')
    if (xAuthToken !== undefined && xAuthToken != null && xAuthToken !== '') {
      this.$router.push({path: '/Index'})
    }
  },
  beforeDestroy: function (){
    window.removeEventListener('beforeunload', e => this.onbeforeunloadLocal());
    window.removeEventListener('unload', e => this.unloadLocal());
  },
  methods: {
    reload () {
      this.isRouterAlive = false
      this.$nextTick(function () {
        this.isRouterAlive = true
      })
    },
    onbeforeunloadLocal: function () {
      this.startTime = Math.ceil(new Date().getTime() / 1000)
    },
    unloadLocal: function () {
      let endTime = Math.ceil(new Date().getTime() / 1000)
      let duration = endTime  - this.startTime
      if (duration > 5) { // 刷新浏览器
         return
      }

      // TODO 浏览器关闭后，需要做的事情
    }
  }
}
</script>
<style>
  @import  'assets/css/common.css';
  @import  'assets/css/search-bar.css';
</style>
